<template>
  <div>
    <i class="el-icon-plus" @click="$router.push(`/home/aisong/add`)"></i>
    <div class="center"> 
      
      <ul v-for="item in huayi" :key="item.d_id" class="list">
        <li >
           
          <img :src="item.src" alt="" >
          
          <div style="display: flex; justify-content: space-between;" >
            <i class="el-icon-edit" @click="$router.push(`/home/aisong/updata/${item.d_id}`)"></i>
            <i class="el-icon-delete" @click="del(item.d_id)" style="
           ;
            
            "
            id="delet"></i>
          <div class="right"> <span>{{ item.dynasty }}--{{ item.p_names}}</span></div>
          <div class="left">
            <span>下载量：{{ item.down }}</span>
            <span>浏览：{{ item.look }}</span>
          </div></div>
        </li>
      </ul>
    </div>
    <el-pagination
        style="margin-top: 20px;"
        background
        layout="->, total, prev, pager, next, jumper"
        :total="pageSize*18"
        
        :current-page="page"
        @current-change="changeCurrentPage($event)">
      </el-pagination>
  </div>
</template>

<script>

import httpApi from '@/http';
 
 export default {
  

  data() {
  
    return {
      isRouterAlive:true,
      d_id:"",
      page:0,
      huayi:[],
      pageSize:0,
      val:0,
		
    }
  },
  methods: {
   
    del(d_id){
  console.log('即将删除的藏品ID:', d_id)
        this.$confirm('将永久删除该藏品, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          // 发送http请求, 执行删除业务
          console.log(httpApi.AisonghuaApi)
          httpApi.AisonghuaApi.delete({d_id}).then(res=>{
         
           this.changeCurrentPage(this.val)
            // this.$router.push('/home/huayi')
         

    
            
          })
        })
      
},

    changeCurrentPage(val){
      console.log(val)
     this.val=val
      
      httpApi.AisonghuaApi.queryAll({page:val}).then(res=>{
        console.log(res)
        this.huayi=res.data.data.result
        
        this.pageSize=res.data.data.pageSize
        console.log( this.pageSize)
 
      })
        },
// listai(page){ 
//   httpApi.AisonghuaApi.queryAll({page:this.page}).then(res=>{
//         console.log(res)
//         this.huayi=res.data.data.result
//         this.pageSize=res.data.data.pageSize
//         console.log( this.pageSize)

//       })
// },
   
  },
  mounted () {
    this.changeCurrentPage(1);
    //  this.listai(1)
  },
 };
</script>

<style lang="scss" scoped>
.center{
width: 800px;
  margin: auto;
 
   
  .list{
    list-style: none;
    display: inline-block; 
    margin: 5px;
   
    
    li{
     
    
      width: 250px;
      font-size: 10px;
      img{
        width: 100%;
      }
   
  }
  }
}
</style>